<template>
  <div>
    <el-select
      v-model="valueAccountName"
      class="filter-item"
      clearable
      placeholder="account_name"
    >
      <el-option
        v-for="item in options.account_names"
        :key="item"
        :label="item"
        :value="item"
      />
    </el-select>
    <el-button
      class="filter-item"
      type="primary"
      icon="el-icon-search"
      @click="handleFilter"
    >jump
    </el-button
    >
  </div>
</template>

<script>
import {
  api_account_names
} from '@/api/pnl_analysis'

export default {
  data() {
    return {

      options: { account_names: {}, symbolNames: {} },
      valueAccountName: ''

    }
  },
  mounted() {
    this.get_account_names()
  },
  methods: {
    get_account_names() {
      api_account_names()
        .then((response) => {
          console.log('account_names_fetched')
          // console.log(response.data)
          this.options.account_names = response.data
        })
        .catch((e) => {
          console.log(e)
        })
    },
    handleFilter() {
      console.log('jump')
      this.$router.push({ name: 'demo', params: {account: this.valueAccountName } })
    }
  }
}
</script>

